"use client"

import React from 'react';
import {usePathname} from "next/navigation";
import Image, {StaticImageData} from "next/image";
import {Button} from "antd";

interface IProps {
    imgUrl: StaticImageData;
    altTxt: string;
    content: string;
}

function Header(props: IProps) {
    const pathname = usePathname();
    return (
        <div className={"h-screen relative"}>
            <div className={"absolute inset-0 -z-10"}>
                {/*图片组件*/}
                <Image src={props.imgUrl} fill style={{objectFit: 'cover'}} alt={props.altTxt}></Image>
                {/*图片蒙层*/}
                <div className={"absolute inset-0 bg-gradient-to-r from-gray-800"}></div>
            </div>
            <div className={" flex justify-center pt-48"}>
                <h1 className={"text-white text-6xl"}>{props.content}</h1>
                <Button type="primary">Button</Button>
            </div>
        </div>
    );
}

export default Header;
